$card-height: 100%
$card-between-distance: 1.25rem
$deck-margin-left: 3rem
$deck-margin-right: 2rem
$card-radius: 0.375rem

.card-deck
    margin-left: $deck-margin-left
    margin-right: $deck-margin-right

    &-single
        max-width: 22rem
        padding-left: $card-between-distance / 2
        padding-right: $card-between-distance / 2

    .card
        background-color: #FFFFFF
        border: transparent
        box-shadow: 3px 4px 8px 4px rgba(92,92,92,0.08)
        border-radius: 0.375rem
        margin-left: 0
        margin-right: 0

        &-header
            border: transparent
            border-top-left-radius: $card-radius
            border-top-right-radius: $card-radius
            border-bottom-right-radius: 0
            border-bottom-left-radius: 0



.card-inner
    position: relative
    height: 32.5rem

    .front,
    .back
        position: absolute
        width: 100%
        height: 100%
        backface-visibility: hidden
        transform-style: preserve-3d
        transition: ease-in-out 600ms